import React, { useEffect, useState } from 'react';
import './Addnew.scss'
import {useNavigate, useSearchParams} from "react-router-dom"
import { PlusOutlined } from '@ant-design/icons';
import {
  Form,
  Input,
  Button,
  DatePicker,
  TreeSelect,
} from 'antd';
import * as service from '../../../../api/index'
import * as zzservice from '../../../../api/indexzz';


const { RangePicker } = DatePicker;
const { TextArea } = Input;
interface Props {

}
function Addnew(props:Props) {
    let navigate=useNavigate()
    const [type,setType]=useState([])
    const [call,setCall]=useState([])
    const [tu,setTu]=useState<any>('')
    const [below,setBelow]=useState<any>({})
    const [form] = Form.useForm();

    const onFinish = async(values: any) => {
        values.pic=tu
        // console.log('Success:', values);
       let  messages=values
       console.log(messages);
       
        if(values.id){
          // var res1=await service.new_xiunews(values)
          var res1=await zzservice.new_updateMessages2(values)
        }else{
          // var res=await service.new_addnews(values)
          var res=await zzservice.new_addMessages(messages)
        }
        navigate('/index/newsmanage/newslist')
        
      };
      
      const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
       
      };

      let [params, setParams] = useSearchParams ();
      var fa=async()=>{
        var id=params.get('id')
        if(id){
          // 修改数据回填
          // var res2=await service.new_edit({id})
          var res2=await zzservice.new_updateMessages1({id})
          
          res2.data.data.pic=''
          res2.data.data.time = ''
          console.log(res2.data.data.time);
          form.setFieldsValue(res2.data.data)
          setBelow(res2.data.data)

        } 
        // 新闻分类
        // var res1=await service.new_newsfei()
        var res1=await zzservice.user_fmessages()
        setCall(res1.data.data)

       }
       useEffect(()=>{
           fa()
       },[])

       var onChange = (e:any)=>{
        var reader = new FileReader();
        reader.readAsDataURL(e.target.files[0])
        reader.onload = function(){
            setTu(this.result)
    }
  
    }
    return (
        <div className='addcar'>
             <div className="hai">
            <div className='hhh'>
                <div className="h"></div>
            <div className="hh1">新增新闻</div>
            </div>
            <Button onClick={()=>{navigate(-1)}}>返回</Button>
            </div>
            <Form
            form={form}
        name="basic"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        style={{ maxWidth: 600 }}
        initialValues={{ remember: true }}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
        autoComplete="off"
      >
       
        <Form.Item
         label="id"
         name="id"
         hidden
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item
         label="新闻标题"
         name="title"
        rules={[{ required: true, message: '新闻标题不能为空!' }]}
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item 
        label="新闻简介"
        name="text"
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item 
        label="分类"
        name="sort"
        rules={[{ required: true, message: '分类不能为空!' }]}
        >
          <TreeSelect treeData={call}/> 
        </Form.Item>
        <Form.Item 
        label="可见范围"
        name="ranges"
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item 
        label="浏览量"
        name="views"
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item 
        label="收藏量"
        name="collection"
        >
          <Input  placeholder='请输入'/>
        </Form.Item>
        <Form.Item name="time" label="发布时间">
      <DatePicker showTime format="YYYY-MM-DD HH:mm:ss" />
    </Form.Item>
       
        <Form.Item 
                    label="选择图片"
                    name="pic"
                    >
                    <Input type='file' onChange={onChange}/>
                </Form.Item>
        
        <Form.Item >
        
          <Button type="primary" htmlType="submit" style={{marginLeft:180}}>
          
            {
                form.getFieldValue('id')?'更新':'新增'
              }
            </Button>
        </Form.Item>
      </Form>
        </div>
    );
}

export default Addnew;